*{
  margin: 0;
  padding: 0;
  text-decoration: none;
  /* color:white; */
  font-family: Barlow;

}

body{
  width: 100vw;
  height: 100vh;
}
.main_container{
  background-color: #fdfdfd;
  width: 100%;
  height: 100%;
  font-family: Barlow;
}
.head{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 5px;
  margin: 5px;
  font-size: 20px;
  color: #000000;
}
.head a{
  color: #000000;
}

.rows{
  color: white;
}

.head p{
  color: black;
  text-align: center;}

.rows{
  display: flex;
  justify-content: center;
}
.global{
  width: 150px;
  height: 110px;
  display: flex;
  align-items: end;
  justify-content: end;
  flex-grow: 1;
  flex-shrink: 1;
  padding: 5px  5px;
}
.global:hover{
  opacity: 90%;
}
.button1{
  display: flex;
  align-self: center;
  justify-self: center;
  text-align: center;
  
  cursor: pointer;
}
.button1 button{
  opacity: 0;
  border: 2px solid rgba(255, 255, 255, 0.733);
  font-family: Barlow;
  font-weight: 500;
  color:  rgba(255, 255, 255, 0.87);
  background-color: rgba(255, 255, 255, 0);
  font-size: 1.01rem;
  padding: 0.7vw 1.6vw;
  pointer-events: none;
  border-radius: 3px;
  transition: opacity 0.4s;
}
.button1:hover button{
  opacity: 1;
}
.global p{
  font-weight: 600;
}
.head button{
  padding: 8px 10px;
  color: #fdfdfd;
  background-color: #000000;
  border-radius: 5px;
  border: none;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  font-size: 17px
}
#one1{
  background-color:#FFC312;
}

#one2{
  background-color: #C4E538;
}
#one3{
  background-color:#12CBC4;
}
#one4{
  background-color: #FDA7DF;
}
#one5{
  background-color:#ED4C67;
}

#two1{
  background-color:#F79F1F;
}

#two2{
  background-color:#A3CB38;
}
#two3{
  background-color:#1289A7;
}
#two4{
  background-color:#D980FA;
}
#two5{
  background-color:#B53471;
}


#three1{
  background-color:#EE5A24;
}

#three2{
  background-color: #009432;
}
#three3{
  background-color:#0652DD ;
}
#three4{
  background-color:#9980FA ;
}
#three5{
  background-color:#833471 ;
}

#four1{
  background-color:#EA2027;
}
#four2{
  background-color: #006266;
}
#four3{
  background-color: #1B1464;
}
#four4{
  background-color:#5758BB;
}
#four5{
  background-color: #6F1E51;
}
@media (max-width:500px){
  p{
   display: none;
  }
  .global{
    width: 50px;
    height: 60px;
    display: flex;
    align-items: end;
    justify-content: end;
    flex-grow: 1;
    padding: 10px  10px;
  }
  button{
    display: none;
  }
 }
@media (max-width:770px){
 p{
  display: none;
 }
 .global{
  width: 50px;
  height: 100px;
}
}